<!--
 * @Author: 整体布局
 * @Date: 2023-02-25 13:51:38
 * @LastEditors: yangfan 1437446666@qq.com
 * @LastEditTime: 2023-03-02 17:24:09
 * @FilePath: \creation-platform-113\src\components\HelloWorld.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <a-layout style="min-height: 100vh">
    <MenuList> </MenuList>
    <a-layout style="min-height: 100%">
      <LayoutHeader></LayoutHeader>
      <LayoutContext class="main"></LayoutContext>
    </a-layout>
  </a-layout>
</template>
<script lang="ts">
import { defineComponent, onMounted, ref } from 'vue'
// import BScroll from 'better-scroll'

export default defineComponent({
  setup(props, context) {
    onMounted(() => {
      const scroll: HTMLAnchorElement | null =
        document.querySelector('ant-layout-content')
      // const Bcscroll = new BScroll(scroll as HTMLAnchorElement, {
      //   scrollY: true,
      //   click: true
      // })
    })
    return {}
  }
})
</script>
<style scoped>
.box-wrap {
  height: 100vh;
}
.main {
  flex: 1;
}
#components-layout-demo-custom-trigger .trigger {
  width: 50px;
  height: 50px;
  font-size: 18px;
  line-height: 64px;
  padding: 0 24px;
  cursor: pointer;
  transition: color 0.3s;
}
#components-layout-demo-custom-trigger .trigger:hover {
  color: #1890ff;
}
.layout-header {
  background: #fff !important;
  height: 140px !important;
  padding: 0 18px !important;
}
.ant-layout-header.layout-header.work {
  height: 200px !important;
}

/* .btn span:nth-child(1) {
  font-size: 30px;
  display: block;
  padding: 0 5px;
}
.btn span:nth-child(2) {
  font-size: 18px;
} */
</style>
